import React, { Component } from 'react';
import './Nav.scss'
import service from '../../api';

interface Props {

}
interface State {
    navList: any[]
}


class Index extends Component<Props, State> {
    constructor(props: Props) {
        super(props);
        this.state = {
            navList: [
                { pic: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png', name: '嗨购超市' }, { pic: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png', name: '数码电器' }, { pic: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png', name: '嗨购超市' }, { pic: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png', name: '数码电器' }, { pic: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png', name: '嗨购超市' }, { pic: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png', name: '数码电器' }, { pic: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png', name: '嗨购超市' }, { pic: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png', name: '数码电器' }, { pic: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png', name: '嗨购超市' }, { pic: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png', name: '数码电器' }
            ]
        }
    }

    async componentDidMount(){
        // var res = await service.address.catelist({})
        // console.log(res);
        this.setState({
            // navList: res.data.data
        })
        
    }

    render() {
        return (
            <div className='nav'>
                {
                    this.state.navList.map((item,index)=>{
                        return (
                            <div className="navlist" key={index}>
                                <img src={item.pic} alt="" />
                                <div className="name">{item.name}</div>
                            </div>
                        )
                    })
                }
            </div>
        );
    }
}

export default Index;